<template>
	<view class="content">
		<image class="logo" src="/static/logo.png"></image>
		<view class="text-area">
			<text class="title">{{title}}</text>
			<button @click="tapHandle">点我啊</button>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				msg: 'hello-uni',
				img: 'http://destiny001.gitee.io/image/monkey_02.jpg',
				arr: [
				      { name: '刘能', age: 29 },
				      { name: '赵四', age: 39 },
				      { name: '宋小宝', age: 49 },
				      { name: '小沈阳', age: 59 }
				    ]
			}
		},
		onLoad() {

		},
		methods: {
		  tapHandle () {
		    console.log('真的点我了')
		  }
		}
	}
</script>

<style>
	.content {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.logo {
		height: 200rpx;
		width: 200rpx;
		margin-top: 200rpx;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50rpx;
	}

	.text-area {
		display: flex;
		justify-content: center;
	}

	.title {
		font-size: 36rpx;
		color: #8f8f94;
	}
</style>

<template>
  <view class="content">
    <view class="uni-list">
      <view
        class="uni-list-cell"
        hover-class="uni-list-cell-hover"
        v-for="(item, index) in news"
        :key="index"
        @click="openInfo"
        :data-newsid="item.post_id"
      >
        <view class="uni-media-list">
          <image
            class="uni-media-list-logo"
            :src="item.author_avatar"
          ></image>
          <view class="uni-media-list-body">
            <view class="uni-media-list-text-top">{{ item.title }}</view>
            <view class="uni-media-list-text-bottom uni-ellipsis">
              {{ item.created_at }}
            </view>
          </view>
        </view>
      </view>
    </view>
    <image class="logo" src="/static/logo.png"></image>
    <view class="text-area">
      <text class="title">{{ title }}</text>
      <button @click="tapHandle">点我啊</button>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      msg: 'hello-uni',
      img: 'http://destiny001.gitee.io/image/monkey_02.jpg',
      arr: [
        { name: '刘能', age: 29 },
        { name: '赵四', age: 39 },
        { name: '宋小宝', age: 49 },
        { name: '小沈阳', age: 59 }
      ],
      news: []
    }
  },
  onLoad() {
    uni.showLoading({
      title: '加载中....'
    })
    uni.request({
      url: 'https://unidemo.dcloud.net.cn/api/news',
      method: 'GET',
      data: {},
      success: res => {
        this.news = res.data
        uni.hideLoading()
      },
      fail: () => {},
      complete: () => {}
    })
  },
  methods: {
    tapHandle() {
      console.log('真的点我了')
    },
    openInfo(e) {
      console.log(e)
      var newsid = e.currentTarget.dataset.newsid
      uni.navigateTo({
        url: '../detail/detail?newsid=' + newsid
      })
    }
  }
}
</script>

<style>
.content {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.uni-media-list-body {
  height: auto;
}

.uni-media-list-text-top {
  line-height: 1.6em;
}

.logo {
  height: 200rpx;
  width: 200rpx;
  margin-top: 200rpx;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 50rpx;
}

.text-area {
  display: flex;
  justify-content: center;
}

.title {
  font-size: 36rpx;
  color: #8f8f94;
}
</style>